<template>
	<el-row :gutter="10" class="top-view">
		<el-col :span="6"><today-sales /></el-col>
		<el-col :span="6"><today-orders /></el-col>
		<el-col :span="6"><today-users /></el-col>
		<el-col :span="6"><total-user /></el-col>
	</el-row>
</template>

<script lang="ts">
export default {
	name: 'TopView',
}
</script>

<script lang="ts" setup>
import TodayOrders from './components/TodayOrders.vue'
import TodaySales from './components/TodaySales.vue'
import TodayUsers from './components/TodayUsers.vue'
import TotalUser from './components/TotalUser.vue'
</script>

<style lang="scss">
.emphasis {
	font-size: 12px;
	font-weight: 700;
	color: #666;
}
.increment {
	display: inline-block;
	// border: 1px solid #000;
	border-width: 4px;
	border-style: solid;
	border-color: transparent transparent green transparent;
}
.decrement {
	display: inline-block;
	// border: 1px solid #000;
	border-width: 4px;
	border-style: solid;
	border-color: red transparent transparent transparent;
}
</style>
